<template>
  <div v-if="this.eassay.data && this.eassay.data.length != 0" class="content">
    <el-table :data="this.eassay.data" style="width: 100%" stripe>
      <el-table-column prop="title" label="标题" width="200" align="center">
      </el-table-column>
      <el-table-column label="图片" width="350" align="center">
        <template slot-scope="scope">
          <img :src="scope.row.img" width="250px" height="120px" alt="" />
        </template>
      </el-table-column>
      <el-table-column prop="worker" label="作者" width="180" align="center">
      </el-table-column>
      <el-table-column prop="date" label="时间" width="200" align="center">
      </el-table-column>
      <el-table-column label="操作" width="180" align="center">
        <template slot-scope="scope">
          <el-button icon="el-icon-edit" @click="$router.push(`/home/eassayUpdate/${scope.row.e_id}`)">
          </el-button>
          <el-button
            type="danger"
            icon="el-icon-delete"
            @click="del(scope.row.e_id)"
          >
          </el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import httpApi from "@/http/index.js";
export default {
  data() {
    return {
      eassay: {
        data: [],
      },
    };
  },
  methods: {
    queryAllEassay() {
      httpApi.eassay.queryAll().then((result) => {
        // console.log(result);
        this.eassay = result.data.data;
      });
    },
    //删除
    del(id) {
      this.$confirm('正在永久删除该信息，确认继续吗？', '警告', {
        confirmButtonText: '残忍删除',
        cancelButtonText: '我再想想',
        type: 'warning'
      }).then(()=>{
         httpApi.eassay.DelEassay({id}).then(()=>{
          this.$message({
            type: 'success',
            message: '删除成功！'
          });
          this.queryAllEassay()
         })
      }).catch(()=>{
        this.$message({
          type: 'info',
          message: '取消删除'
        });
      })

    },
  },
  mounted() {
    this.queryAllEassay();
  },
};
</script>

<style lang="scss" scoped>
.content {
  overflow: scroll;
  height: 600px;
}
</style>
